<template>
  <div>
    <form @submit.prevent="fn">
      <label>姓名：</label>
      <input type="text" v-model="username" /><br /><br />

      <label>年龄：</label>
      <input type="number" v-model="age" /><br /><br />

      <label>身高：</label>
      <input type="number" v-model="height" step="0.01" />(米)<br /><br />

      <label>体重：</label>
      <input type="number" v-model="weight" />(公斤)<br /><br />

      <label>病史：</label>
      <input type="text" v-model="sick" /><br /><br />

      <button>诊断</button>
    </form>

    <p v-show="flag">患者 {{ username }}的诊断结果：{{ res }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      username: '',
      age: '',
      height: '',
      weight: '',
      sick: '',
      res: '',
      flag: '',
    }
  },
  methods: {
    fn() {
      this.flag = true
      let bmi = (this.weight / this.height) ^ 2
      if (bmi > 24.9) {
        this.res = '体重过重'
      } else if (bmi < 18.5) {
        this.res = '体重过轻'
      } else {
        this.res = '健康'
      }
    },
  },
}
</script>
